<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.org/ui">

<div class="programs-panel">
	<p:outputLabel id="programsPanel" header="البرامج">
	
		<h:outputLabel value="البرامج" style="font-size: 18px; font-family:Arial,sans-serif;"/>
		<div class="article-separator"></div>
		
		<h:form>
			<p:dataTable value="#{programsBean.programsSchedules}"
				tableStyleClass="naskh-font small-size" emptyMessage="لا يوجد أية برامج" rows="20" scrollHeight="300px" var="schedule">
				<p:column headerText="البرنامج" width="40%">
					<p:outputLabel value="#{schedule.program.name}"></p:outputLabel>
				</p:column>
				
				<p:column headerText="المدينة" width="20%" style="text-align:center">
					<p:outputLabel value="#{schedule.city.name}" />
				</p:column>
				
				<p:column headerText="تاريخ البداية" width="20%" style="text-align:center" >
					<p:outputLabel value="#{schedule.startDate}" />
				</p:column>
				
				<p:column headerText="تاريخ الانتهاء" width="20%" style="text-align:center" >
					<p:outputLabel value="#{schedule.endDate}" />
				</p:column>
	
				
			</p:dataTable>
		</h:form>
	</p:outputLabel>
</div>

</html>
